<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>上元每日出勤打卡click in、out</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<style>
    *{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
  
    button{
        width: 100px;
        height: 100px;
    }
</style>

      
<body>

    <div id="app">
        <!-- <div class="container"> -->
            <!-- <h1>{{responseData.className}}</h1> -->
            <!-- <img src="http://file.233863.com/upload/20210131/84b23fc37492432f81bcf148030ae84f.png" alt=""> -->
            <!-- <span>{{responseData.classCalers.teachName}}</span> -->
            <!-- <div class="box">
                <div v-for="item in responseData.classCalers">
                    <p>{{item.techDate}}</p>
                    <p>{{item.stuSignNum?'打卡完成':'未打卡'}}</p> -->
                    <!-- 传送后端的数据 -->
                    <!-- <p>{{item.calerId}}</p>
                </div>
            </div>
            
        </div> -->
        <button @click="getData">打卡</button>

    </div>


 

    <script>

        var app = new Vue({
            el:"#app",
            data:{
                token:"",
                person:{
                        'username':"18667184527",
                        'passwd':"fly940106"
                    }
            },
            created() {
                //1. 初始化登录获取后端返回的token值存入
           
                    axios.post('https://gate.shangyuanjiaoyu.com/oluc/v1/login/simple',app.person).then(function (response) { 
                        app.token=response.data.data.token;
                        console.log(response);
                    }).catch(function (error) {
                        console.log(error);
                    });
            
            },
            methods: {
                // 2.点击按钮获取未打卡的信息存入responseData中
                getData(){
                    //2.1 设置请求头中的token
                    
                   
                        axios.interceptors.request.use(function(config){
                            config.headers.Authorization = app.token;
                            return config;
                        });

                        //2.2 获取个人打卡信息接口数据
                        axios.post('https://gate.shangyuanjiaoyu.com/olprod/v1/personal/caler/sign',{"classId": 157837236568163}).then(response=>{
                            // 获取每天打卡的数组数据
                       
                            console.log(response);
                        })
                        
                },
               


                

            },

        });
 

    </script>





   
</body>

</html>